<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>天气</title>
    <link rel="stylesheet" href="./css/weather.css"/>
    <link rel="stylesheet" href="./css/css.css"/>
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main.css"/>
    <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=e303dae87fb68597e0101c7743159a66"></script>
    <script type="text/javascript" src=" https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script>
    <script src="./js/weather.js"></script>
    <script src="./js/clock.js"></script>
    <script src="./js/calculator.js"></script>

</head>
<body>
<div class="clock">
    <div class="day" id="day">
        --年--月--日
    </div>
    <div class="time" id="time">
        --:--:--
    </div>

    <!--<div id="Timer">-->
        <!--定时：<input type="number" id="input"/>-->
        <!--<button onclick="functionTimer()" class="btn alive">开始定时</button>-->
        <!--<div id="Timer_show">-->
            <!--剩余时间：&#45;&#45;-->
        <!--</div>-->
    <!--</div>-->
</div>
<div class="weather">
    <div class="weather-top">
        <div class="search-citys">
            <input class="text" id="city_name" type="text" value="请输入城市中文或拼音 / 点击选择城市" onKeyUp="input_keyup();" onClick="append_city();" onBlur="input_blur()" onFocus="if(value=='请输入城市中文或拼音 / 点击选择城市'){value='';style.color='#606060';}" />
            <input class="text" id="hid_city_name" name="index_city" style="display:none">
            <input class="text" id="hid_real_city_name" name="real_index_city" style="display:none">

            <!--热门城市下拉-->
            <div class="pop search-citys-pop click" style="display:none;z-index:9999" id="cityarea">
                <a href="javascript:void(0)" class="pop-close" ></a>
                <div class="search-citys-tit click">热门城市(可直接输入中文名/拼音/三字码)</div>
                <div class="search-citys-tt click">
                    <a class="current click" onClick="tabCutover(this,'s-citys1')" href="javascript:void(0)">热门<span></span></a>
                    <a class="click" onClick="tabCutover(this,'s-citys2')" href="javascript:void(0)">ABCDEFG<span></span></a>
                    <a class="click" onClick="tabCutover(this,'s-citys3')" href="javascript:void(0)">HIJKL<span></span></a>
                    <a class="click" onClick="tabCutover(this,'s-citys4')" href="javascript:void(0)">MNOPQRST<span></span></a>
                    <a class="click" onClick="tabCutover(this,'s-citys5')" href="javascript:void(0)">UVWXYZ<span></span></a>
                </div>
                <div class="search-citys-list click" id="citylist"></div>
            </div>
        </div>
        <ul>
            <li id="info"></li>
            <li id="top-day"></li>
            <li>(实时：</li>
            <li id="temp-top"></li>
        </ul>
    </div>
    <div class="today">
        <div class="today-main">
            <div class="today-img">
                <img id="today-img" src="./img/1.png" alt=""/>
            </div>
            <div class="today-temperature" id="today-temperature">

            </div>
            <div class="today-text" id="today-text">
                <ul>
                    <li id="today-condition"></li>
                    <li id="today-win"></li>
                    <li id="spead"></li>
                </ul>
            </div>
        </div>
        <div class="today-bottom">
            空气质量：39优
        </div>
    </div>
    <div class="nextDay next-1" id="next-1">
        <div class="next-top" id="next-top-1">

        </div>
        <div class="next-weather">
            <img id="next-img-1" src="./img/1.png" alt=""/>
        </div>
        <div class="next-bottom">
            <ul>
                <li id="next-tem-1"></li>
                <li id="next-cond-1"></li>
                <li id="next-wind-1"></li>
            </ul>
        </div>

    </div>
    <div class="nextDay next-2" id="next-2">
        <div class="next-top" id="next-top-2">

        </div>
        <div class="next-weather">
            <img id="next-img-2" src="./img/1.png" alt=""/>

        </div>
        <div class="next-bottom">
            <ul>
                <li id="next-tem-2"></li>
                <li id="next-cond-2"></li>
                <li id="next-wind-2"></li>
            </ul>
        </div>
    </div>
    <div class="nextDay next-3" id="next-3">
        <div class="next-top" id="next-top-3">

        </div>
        <div class="next-weather">
            <img id="next-img-3" src="./img/1.png" alt=""/>

        </div>
        <div class="next-bottom">
            <ul>
                <li id="next-tem-3"></li>
                <li id="next-cond-3"></li>
                <li id="next-wind-3"></li>
            </ul>
        </div>
    </div>
    <div class="nextDay next-4" id="next-4">
        <div class="next-top" id="next-top-4">

        </div>
        <div class="next-weather">
            <img id="next-img-4" src="./img/1.png" alt=""/>

        </div>
        <div class="next-bottom">
            <ul>
                <li id="next-tem-4"></li>
                <li id="next-cond-4"></li>
                <li id="next-wind-4"></li>
            </ul>
        </div>
    </div>
    <div class="nextDay next-4" id="next-5">
        <div class="next-top" id="next-top-5">

        </div>
        <div class="next-weather">
            <img id="next-img-5" src="./img/1.png" alt=""/>

        </div>
        <div class="next-bottom">
            <ul>
                <li id="next-tem-5"></li>
                <li id="next-cond-5"></li>
                <li id="next-wind-5"></li>
            </ul>
        </div>
    </div>
    <div class="nextDay next-4" id="next-6">
        <div class="next-top" id="next-top-6">

        </div>
        <div class="next-weather">
            <img id="next-img-6" src="./img/1.png" alt=""/>

        </div>
        <div class="next-bottom">
            <ul>
                <li id="next-tem-6"></li>
                <li id="next-cond-6"></li>
                <li id="next-wind-6"></li>
            </ul>
        </div>
    </div>
</div>
<div id="counter">
    <div id="counter_content">
        <h3><input id="input1" type="text" value="0" /></h3>
        <ul>
            <li>7</li>
            <li>8</li>
            <li>9</li>
            <li>+</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            <li>-</li>
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>×</li>
            <li>0</li>
            <li>C</li>
            <li>=</li>
            <li>÷</li>
        </ul>
    </div>
    <div id="bg"></div>

</div>
<!--<embed  height="100" width="400" data="./sound/111.mp3">-->
<!--<audio controls id="music1"style="display: none;">-->
    <!--<source src="./sound/111.mp3" type="audio/mpeg">-->
<!--</audio>-->
<script src="js/cities.js"  type="text/javascript"></script>
<script src="js/jquery.autocomplete.js" type="text/javascript"></script>
</body>
</html>
